{% extends "WebMainSiteBundle:Web:layout.html.twig" %}
{% set title = "课程首页" %}
{% block title %}
    {{ title }}
{% endblock %}
{% block myCss %}

{% endblock %}

{% block myJs %}
{#<script>#}
    {#$(function () {#}
        {#$("#courseLikes").on("click","a", function () {#}
            {#$.get("{{ path("WebCourseLikesAdd" , { id : course.id }) }}", function (data) {#}
                {#if (data.s == 1) {#}
                    {#alert(data.i);#}
                {#}#}
            {#})#}
        {#})#}
    {#});#}
{#</script>#}
{% endblock %}
{% block page_header %}
    <div class="page-header">
        <div class="container">
            <div class="row">
                <div class="col-md-7">
                    <h1 class="yahei">{{ course.title }}</h1>
                </div>
                <div class="col-md-5">
                    <ol class="breadcrumb pull-right">
                        <li><a href="{{ path("WebIndex") }}">主页</a></li>
                        <li class="active">{{ title }}</li>
                    </ol>
                </div>
            </div>
        </div>
    </div>
{% endblock %}
{% block main %}
    <section class="content content-light  video-film">
        <div class="container">
            <div class="row">
                <div class="col-md-8">
                    <article>
                        <a href="" class="video-prev" style="height:350px; background-image:url('{{ asset(course.picMain) }}'); background-size: cover;background-position: center"></a>
                        <hr/>
                        <div class="video-content">
                            <p>{{ course.info | raw }}</p>
                        </div>
                        <hr/>
                        <hr class="invisible" />
                        <section class="related">
                            <hr/>
                            <h2 class="yahei">课时安排</h2>
                            <hr class="invisible" />
                            <div class="row">
                                {% for row in courseLessonArrange %}
                                    {% set width = 12 %}
                                    <article class="col-md-12">
                                        <p class="button-full" style="padding-left: {{ row.level * 2 }}em">
                                            <span class="btn btn-dark course_arrange_title">
                                                <i class="fa fa-tasks"></i>{{ row.title }}
                                            </span>
                                        </p>
                                    </article>
                                    {% for lesson in row.lessons %}
                                        <article class="col-md-12" style="padding-left: {{ row.level * 2 + 2 }}em">
                                            <p class="button-full">
                                                <a href="{{ path("WebCourseLessons" , { uniqueId:course.uniqueId ,id:lesson.id}) }}" class="btn btn-green course_arrange_title">
                                                    <i class="fa fa-book"></i> {{ lesson.title }}
                                                </a>
                                            </p>
                                        </article>
                                    {% endfor %}
                                {% endfor %}
                            </div>
                        </section>
                    </article>
                </div>
                <aside class="col-md-4">
                    <h3 class="video-title yahei">{{ course.title }}</h3>
                    <p class="video-params">
                        课程讲师: <b>Joe Doe</b></p>
                    <p class="video-params">
                        更新日期: <b>{{ course.updateTime | date("Y-m-d H:i:s") }}</b></p>
                    <p class="video-params">
                        累计学员: <b>312</b>人</p>
                    <p class="video-params">
                        {#<div class="row">#}
                            {#<span class="col-md-6"><b><i class="fa fa-heart"></i> {{ courseLikes }}</b></span>#}
                            {#<span class="col-md-6"><b><i class="fa fa-plus"></i> 15</b></span>#}
                        {#</div>#}
                    </p>
                    <div class="row buttons-margin-horizontal">
                        <div class="col-md-6 button-full" id="courseLikes">
                            {% if userLikes != 0 %}
                                <a href="{{ path("WebCourseLikesDel" , { id : course.id }) }}" class="btn btn-theme btn-red"><i class="fa fa-thumbs-up"></i> {{ courseLikes }} 取消</a>
                            {% else %}
                                <a href="{{ path("WebCourseLikesAdd" , { id : course.id }) }}" class="btn btn-theme btn-lightblue"><i class="fa fa-thumbs-up"></i> {{ courseLikes }} 赞一下</a>
                            {% endif %}
                        </div>
                        <div class="col-md-6 button-full">
                            {% if userCollect != 0 %}
                                <a href="{{ path("WebCourseCollectDel" , { id : course.id }) }}" class="btn btn-theme btn-orange"><i class="fa fa-plus"></i> {{ courseCollect }} 取消关注</a>
                            {% else %}
                                <a href="{{ path("WebCourseCollectAdd" , { id : course.id }) }}" class="btn btn-theme btn-lightblue"><i class="fa fa-plus"></i> {{ courseCollect }} 关注</a>
                            {% endif %}
                            {#<a class="btn btn-theme btn-orange"><i class="fa fa-plus"></i> 15 关注</a>#}
                        </div>
                    </div>
                    <p class="button-full buttons-margin-horizontal">
                        {% if firstLesson is not empty %}
                            <a href="{{ path("WebCourseLessons" , { uniqueId:course.uniqueId ,id : firstLesson.id}) }}" class="btn btn-theme btn-green"><i class="fa fa-download"></i> 开始学习</a>
                        {% else %}
                            <a href="" class="btn btn-theme btn-disable"><i class="fa fa-download"></i> 暂无课时，请稍后关注</a>
                        {% endif %}

                    </p>
                </aside>
            </div>

        </div>
    </section>

{% endblock %}